import 'package:flutter/material.dart';
import 'package:flutter_app/domain/feed.dart';
import 'package:flutter_app/presenter/worm/worm_presenter.dart';
import 'package:flutter_app/page/worm/worm_image.dart';
import 'package:cached_network_image/cached_network_image.dart';

/// 图片表格页面
class WormImageGridPage extends StatefulWidget {
  // 作者名称
  final String _name;
  // 图片总数目
  final int _count;
  // 图片列表
  final List<ImageDetail> _images;
  // 主持人
  final WormPresenter _presenter;

  WormImageGridPage(this._name, this._count, this._images, this._presenter,
      {Key key})
      : super(key: key);

  @override
  State<StatefulWidget> createState() => WormImageGridPageState();
}

/// 图片表格状态页面
class WormImageGridPageState extends State<WormImageGridPage> {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          leading: InkWell(
            onTap: () => Navigator.pop(context), // 点击关闭页面
            child: Icon(Icons.arrow_back),
          ),
          title: Text(widget._name),
          centerTitle: true,
        ),
        body: GridView.builder(
          gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
              crossAxisSpacing: 10.0,
              mainAxisSpacing: 10.0,
              crossAxisCount: 3), // 设置间距等
          itemBuilder: this._renderItem,
          itemCount: widget._count,
        ),
      ),
    );
  }

  /// 绘制条目
  Widget _renderItem(BuildContext context, int index) {
    // 图片细节
    ImageDetail item = widget._images[index];
    return Container(
        child: InkWell(
            onTap: () => Navigator.of(context).push(MaterialPageRoute(
                builder: (context) => WormImagePage(
                    tag: 'image$index',
                    url: widget._presenter
                        .getImageUrl(item.userId, item.imgId)))),
            child: Hero(
              tag: 'image$index', // Hero TAG 唯一
              child: CachedNetworkImage(
                errorWidget: (context, url, error) => Icon(Icons.error),
                placeholder: (context, url) => CircularProgressIndicator(),
                imageUrl:
                    widget._presenter.getImageUrl(item.userId, item.imgId),
              ), // 图片缓存
            ) // 跳转之后的页面要存在一个 Hero, 与这个 Hero 的 TAG 与之对应
            ));
  }
}
